﻿<style type="text/css">
    /*登录*/
    .mv-content{margin-top: 0px;padding-bottom:0px;}
    input {-webkit-appearance:none;}
    .mv-login .login-title h2{margin:30px 0px 30px 0px ;text-align:center}
    .mv-login .login-title a{color: #aebce3;display: inline-block;font-weight: 700;font-size: 20px;margin-left: 15px;margin-top: 15px;border-right: 1px solid #ccc;padding-right: 15px;}
    .mv-login .logon-cont{margin-left: 15px;margin-right: 15px;}
    .mv-login .cont-top{border-bottom: 1px solid #f2f2f2;overflow: hidden;height: 50px;line-height: 50px;}
    .cont-top select{width: 100%;border:none;font-size: 15px;outline: none;background: none;height: 50px;}
    .mv-login .cont-top a{display: block;overflow:hidden;}
    .mv-login .cont-top  .cont-a{float: left;}
    .mv-login .cont-top  .cont-b{float: right;}
    .mv-login .cont-top  .cont-b i{font-size: 25px;color: #ccc;float: right;}
    .mv-login .cont-top  .cont-b span{float: right;}
    .mv-login .cont-bottom {border-bottom: 1px solid #aebce3!important}
    .mv-login .cont-bottom input{font-size: 15px;height: 50px;border:none;width: 100%;}
    .mv-login .mv-btn{height: 40px;text-align: center;color: #fff;background-color:#0076FF;line-height: 40px;margin-top: 35px; border-radius: 5px;}
    .mv-login .lg-yzm {width: 29%!important; text-align: center; position: absolute; top: 16px; right: 0; height: 20px!important; border-left: 1px solid #ccc!important;background:none}
</style>
<div class="mv-login">
    <div class="login-title">
        <!--<a v-on:click="back"><i class="iconfont icon-fanhui1"></i></a>-->
        <h2>注册WSD</h2>
    </div>
    <div class="logon-cont validate-area">
        <div class="cont-top">
            <select id="country" class="validate-elem" validate="true" validate-message="请选择地区">
                <option :value="language.id" v-for="language in bag.languages">
                    {{ language.name }}
                </option>
            </select>
        </div>
        <div class="cont-top cont-bottom">
            <input id="moblie" type="text" class="validate-elem" validate="true" validate-message="请输入手机号码" placeholder="请输入手机号码">
        </div>
        <div class="cont-top cont-bottom">
            <input id="recomid" type="text" class="validate-elem" placeholder="推荐人(选填)" :value="recomid" v-if="recomid==null">
            <input id="recomid" type="text" class="validate-elem" placeholder="推荐人(选填)" :value="recomid" v-if="recomid!=null" readonly="readonly">
        </div>
        <div class="cont-top cont-bottom">
            <input id="password" type="password" class="validate-elem" validate="true" validate-message="请输入登陆密码" placeholder="请输入登陆密码">
        </div>
        <div class="cont-top cont-bottom" style="position: relative;">
            <input id="smscode" type="text" class="validate-elem" placeholder="请输入验证码" validate="true" validate-message="请输入验证码" style="width: 70%;float: left;">
            <input type="button" class="lg-yzm" value="获取验证码" v-on:click="send_sms($event)">
        </div>
    </div>
    <a class="mv-btn" v-on:click="submit">免费注册</a>
    <div class="mv-buttom-btn">
        <a v-on:click="login">返回登陆</a>
        <a v-on:click="register_email">邮箱注册</a>
    </div>
</div>
<script type="text/javascript">
    var pagedata = {
        request: {
            method: "VIEW_USER_REGISTER_MOBILE",
            recomid: mview.view.chlid.param.recomid
        },
        screen: {
            header_display: false,
            footer_display: false
        },
        data: {
            recomid: mview.view.chlid.param.recomid
        },
        methods: {
            send_sms: function (event) {
                var elm = event.target;
                var moblie = m.view.node("#moblie").value();
                var country = m.view.node("#country").value();
                if (country.length <= 0) {
                    mview.control.tips("请选择地区");
                    return;
                }
                if (moblie.length <= 0) {
                    mview.control.tips("请输入手机号");
                    return;
                }
                mview.custom.sms_every_send(elm, moblie, country);
            },
            register_email: function () {
                mview.view.load("views/user/register_email.html", {
                    recomid: pagedata.request.recomid
                });
            },
            login: function () {
                mview.view.load("views/user/login.html");
            },
            back: function () {
                mview.view.load("views/user/main.html");
            },
            submit: function () {
                //调用验证表单程序
                mview.view.form.validate("validate-area", function (data) {
                    mview.socket.send({
                        data: {
                            method: "USER_REGISTER_MOBILE",
                            country: data.country,
                            smscode: data.smscode,
                            moblie: data.moblie,
                            recomid: data.recomid,
                            password: data.password
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("注册成功");
                                setTimeout(function () {
                                    mview.view.load("views/user/login.html");
                                }, 1500);
                            }
                            else {
                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            }
        }
    }
    mview.view.chlid.init(pagedata);
</script>